<!--

生成最基本的Restful模板页面

顶部有按（门店、时间段*）查询 添加按钮

包含一个 ag-grid 列表，默认表头只有一行，每列都可查询，默认每条最后有打开、删除按钮

有新增、修改弹出层
-->

<div class="view-header">
    <div class="view-header-left">

        <div class="view-header-item color-open"
             title="添加"
             ng-click="add_open = !add_open" ng-show="!add_open">
            <i class="fa fa-plus"></i> 添加试驾
        </div>

        <div class="view-header-item color-close above-cover no-widen"
             title="关闭"
             ng-click="add_open = !add_open"
             ng-show="add_open">
            <i class="fa fa-close"></i>
        </div>

        <div class="view-header-item color-check above-cover"
             title="确认添加"
             ng-click='vehicle_demo_add.$valid?submit_add():{};'
             title="添加提交{{vehicle_demo_add.$invalid?'请完成表单后再提交!':''}}"
             ng-show="add_open">

            <i class="fa fa-check" ng-show="vehicle_demo_add.$valid"></i>
            <i class="fa fa-ban" ng-show="vehicle_demo_add.$invalid"></i>
            {{vehicle_demo_add.$invalid?'完善表单!':'提交试驾'}}

        </div>

        <!-- edit-->
        <div class="view-header-item color-close above-cover no-widen"
             title="关闭"
             ng-click="edit_open = !edit_open"
             ng-show="edit_open">
            <i class="fa fa-close"></i>
        </div>

        <div class="view-header-item color-check above-cover"
             title="确认修改"
             ng-click='vehicle_demo_edit.$valid?submit_edit():{};'
             title="修改提交{{vehicle_demo_edit.$invalid?'请完成表单后再提交!':''}}"
             ng-show="edit_open">

            <i class="fa fa-check" ng-show="vehicle_demo_edit.$valid"></i>
            <i class="fa fa-ban" ng-show="vehicle_demo_edit.$invalid"></i>
            {{vehicle_demo_edit.$invalid?'完善表单!':'修改试驾'}}
        </div>

    </div>

</div>
<div class="view-content ">
    <div ag-grid="grid" class="ag-fresh ag-custom-center" style="height :100%"></div>
</div>

<!-- add -->
<div class="data-overlay" ng-show="add_open">
    <div class="overlay-container">
        <div class="overlay-header">试驾车报备</div>
        <div ng-form name="vehicle_demo_add" novalidate="novalidate">
            <div class="overlay-content">
                <div class="overlay-column overlay-column-3">
                    <div class="overlay-item">
                        <span class="overlay-name">门店</span>
                        <shop-picker shop="record_add.shop"></shop-picker>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">选择车型</span>
                        <vm-selector
                                vehicle-model="record_add.vehicle"></vm-selector>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">MSRP</span>
                        <input type="text" ng-model="record_add.vehicle.msrp" disabled/>
                    </div>

                    <!-- div class="overlay-item">
                        <span class="overlay-name">成本价</span>
                        <input type="text" ng-model="record_add.vehicle.cost" disabled/>
                    </div -->


                </div>

                <div class="overlay-column overlay-column-3">
                    <div class="overlay-item">
                        <span class="overlay-name">车架号</span>
                        <input type="text" ng-model="record_add.vid" ng-required="true"
                               name="vid"/>

                        <p class="overlay-item-bottom"
                           ng-show="vehicle_demo_add.vid.$invalid">
                            车架号必填
                        </p>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">车牌号</span>
                        <input type="text" ng-model="record_add.license_plate"
                               name="license_plate"
                               ng-required="true"/>

                        <p class="overlay-item-bottom"
                           ng-show="vehicle_demo_add.license_plate.$invalid">
                            车牌号必填
                        </p>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">颜色</span>
                        <input type="text" ng-model="record_add.color"/>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">内饰颜色</span>
                        <input type="text" ng-model="record_add.interior_color"/>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">发动机号</span>
                        <input type="text" ng-model="record_add.engine_no"/>
                    </div>

                </div>

                <div class="overlay-column overlay-column-3">
                    <div class="overlay-item">
                        <span class="overlay-name">状态</span>
                        <select ng-model="record_add.status"
                                ng-options="item.value as item.view for item in vehicle_demo_status"
                                ng-required="true"
                                name="status"
                                ></select>
                        <p class="overlay-item-bottom"
                           ng-show="vehicle_demo_add.status.$invalid">
                            状态必填
                         </p>
                    </div>

                    <div class="overlay-item">
                        <p class="help-doc overlay-item-top" ng-show="toggle_help">
                            报备车辆初始里程数, 请尽量填入整数, 单位是公里
                        </p>
                        <span class="overlay-name">初始里程</span>
                        <input type="number" step="0.1" min="0"
                               ng-model="record_add.mileage"
                               ng-required="true"
                               name="mileage"
                                />
                        <p class="overlay-item-bottom"
                                ng-show="vehicle_demo_add.mileage.$invalid">
                            初始里程必填
                        </p>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>

<!-- edit -->
<div class="data-overlay" ng-show="edit_open">
    <div class="overlay-container">
        <div class="overlay-header">试乘试驾车更改</div>
        <div ng-form name="vehicle_demo_edit" novalidate="novalidate">
            <div class="overlay-content">
                <div class="overlay-column overlay-column-3">

                    <div class="overlay-item">
                        <span class="overlay-name">门店</span>
                        <shop-picker shop="record_edit.shop"></shop-picker>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">选择车型</span>
                        <vm-selector
                                vehicle-model="record_edit.vehicle"></vm-selector>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">MSRP</span>
                        <input type="text" ng-model="record_edit.vehicle.msrp" disabled/>
                    </div>

                    <!--div class="overlay-item">
                        <span class="overlay-name">成本价</span>
                        <input type="text" ng-model="record_edit.vehicle.cost" disabled/>
                    </div -->


                </div>

                <div class="overlay-column overlay-column-3">
                    <div class="overlay-item">
                        <span class="overlay-name">车架号</span>
                        <input type="text" ng-model="record_edit.vid" ng-required="true"
                               name="vid"/>

                        <p class="overlay-item-bottom"
                           ng-show="vehicle_demo_edit.vid.$invalid">
                            车架号必填
                        </p>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">车牌号</span>
                        <input type="text" ng-model="record_edit.license_plate"
                               name="license_plate"
                               ng-required="true"/>

                        <p class="overlay-item-bottom"
                           ng-show="vehicle_demo_edit.license_plate.$invalid">
                            车牌号必填
                        </p>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">颜色</span>
                        <input type="text" ng-model="record_edit.color"/>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">内饰颜色</span>
                        <input type="text" ng-model="record_edit.interior_color"/>
                    </div>

                    <div class="overlay-item">
                        <span class="overlay-name">发动机号</span>
                        <input type="text" ng-model="record_edit.engine_no"/>
                    </div>

                </div>

                <div class="overlay-column overlay-column-3">
                    <div class="overlay-item">
                        <span class="overlay-name">状态</span>
                        <select ng-model="record_edit.status"
                                ng-options="item.value as item.view for item in vehicle_demo_status"
                                ng-required="true"
                                name="status"
                                ></select>
                        <p class="overlay-item-bottom"
                           ng-show="vehicle_demo_edit.status.$invalid">
                            状态必填
                        </p>
                    </div>

                    <div class="overlay-item">
                        <p class="help-doc overlay-item-top" ng-show="toggle_help">
                            报备车辆初始里程数, 请尽量填入整数, 单位是公里
                        </p>
                        <span class="overlay-name">初始里程</span>
                        <input type="number" step="0.1" min="0"
                               ng-model="record_edit.mileage"
                               ng-required="true"
                               name="mileage"
                                />
                        <p class="overlay-item-bottom"
                           ng-show="vehicle_demo_edit.mileage.$invalid">
                            初始里程必填
                        </p>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
